import LChart from './LChart';
import PieChart from './l-chart-lib/pie';
import HisChart from './l-chart-lib/histogram';
import LineChart from './l-chart-lib/line';
import AreaChart from './l-chart-lib/area';
import PyramidChart from './l-chart-lib/pyramid'
import { getPercent } from './utils'

/**
 * @description 绘制pie
 * @param data
 */
export function drawPie(dom: string, data: PieData[], options: ChartOptions = {}) {
    const { lightOpt = {}, cameraOpt = {}, manifest = {} } = options;
    const {
        ladder = true,
        separation = true,
        loop = false,
        concentric = false,
        concentricLoop = false,
        concentricLoopSame
    } = manifest;
    const totalPart = data.reduce((acc, cur) => {
        return acc += cur.value
    }, 0)
    // 获取个模块比例
    const percent = data.reduce((acc: number[], cur) => {
        acc.push(getPercent(cur.value, totalPart));
        return acc;
    }, [])
    // 按比例获取角度并转弧度
    const angleArr = percent.map(item => {
        return item * 360 * Math.PI / 180
    })
    // 初始化chart
    const chartContext = new LChart(dom, (lightOpt as LightOpt), (cameraOpt as CameraOpt));
    // 构造chart所需数据
    const pieData = angleArr.map((item, index) => {
        return {
            radius: 0.5,
            angle: item,
            height: percent[index],
            color: data[index].color,
            title: data[index].title,
            toolTip: data[index].toolTip,
        }
    })
    // 添加物体
    const chartMesh = new PieChart(pieData, {
        ladder,
        separation,
        loop,
        concentric,
        concentricLoop,
        concentricLoopSame
    })
    chartContext.setChartData(chartMesh.group)
}

// 折线图
export function drawHistogram(dom: string, data: HisData[], options: ChartOptions = {}) {
    const { lightOpt = {}, cameraOpt = {}, manifest = {} } = options;
    const { heap = false } = manifest;
    const groupDataArr = data.map(item => item.data);
    const singDataArr = groupDataArr.flat();
    const valueArr = groupDataArr.map(item => {
        return item.reduce((acc, cur) => acc += cur.value, 0)
    });
    const max = Math.max(...valueArr)
    let perWidth: number;
    if (heap) {
        perWidth = getPercent(1, data.length * 2 - 1);
    } else {
        perWidth = getPercent(1, singDataArr.length * 2 - 1);
    }

    const hisData = data.reduce((acc: any, cur) => {
        const { data: gData } = cur;
        const cData = gData.map(item => {
            return {
                perHeight: getPercent(item.value, max),
                perWidth,
                ...item
            }
        })
        acc.push(cData);
        return acc;
    }, [])
    // 初始化chartContext
    const chartContext = new LChart(dom, (lightOpt as LightOpt), (cameraOpt as CameraOpt));
    // 添加物体
    const chartMesh = new HisChart(hisData, perWidth, manifest)
    chartContext.setChartData(chartMesh.group);
}

// 3d 折线图
export function drawLine(dom: string, data: any[], options: ChartOptions = {}) {
    const { lightOpt = {}, cameraOpt = {}, manifest = {} } = options;
    const { smooth = false, noLine = false } = manifest;
    const totalYPartArr: number[] = [];
    const totalZPartArr: number[] = [];
    const dataLenArr: number[] = [];
    data.forEach(item => {
        dataLenArr.push(item.data.length)
        const curYSum = item.data.reduce((t: number, e: any) => {
            t += e.quantY;
            return t;
        }, 0);
        const curZSum = item.data.reduce((t: number, e: any) => {
            t += e.quantZ;
            return t;
        }, 0);
        totalYPartArr.push(curYSum);
        totalZPartArr.push(curZSum);
    })

    const maxPointValueY = Math.max(...totalYPartArr);
    const maxPointValueZ = Math.max(...totalZPartArr);

    const maxDataLen = Math.max(...dataLenArr);
    // 获取各点占据的空间
    const perWidth = getPercent(1, maxDataLen * 2 - 1);

    // 初始化chart
    const chartContext = new LChart(dom, (lightOpt as LightOpt), (cameraOpt as CameraOpt));
    // 构造chart所需数据
    const chartData = data.reduce((acc, item, index) => {
        const { color } = item;
        const dataArr = item.data.reduce((t: any[], e: any, i: number) => {
            const singlePoint = {
                perWidth,
                quantY: getPercent(e.quantY, maxPointValueY),
                quantZ: e.quantZ ? getPercent(e.quantZ, maxPointValueZ) : 0,
                color: item.color,
                title: item.title,
                toolTip: item.toolTip,
            }
            t.push(singlePoint);
            return t;
        }, [])
        acc.push({
            color,
            dataArr
        })
        return acc;
    }, [])
    // 添加物体
    const chartMesh = new LineChart(chartData, { smooth, noLine })
    chartContext.setChartData(chartMesh.group)
}
// 面积图
export function drawArea(dom: string, data: any[], options: ChartOptions = {}) {
    const { lightOpt = {}, cameraOpt = {}, manifest = {} } = options;
    const { smooth = false } = manifest;
    const totalPartArr: number[] = [];
    const dataLenArr: number[] = [];
    data.forEach(item => {
        dataLenArr.push(item.data.length)
        const curSum = item.data.reduce((t: number, e: number) => t += e, 0);
        totalPartArr.push(curSum)
    })

    const maxPointValue = Math.max(...totalPartArr);
    const maxDataLen = Math.max(...dataLenArr);
    // 获取各点占据的空间
    const perWidth = getPercent(1, maxDataLen * 2 - 1);

    // 初始化chart
    const chartContext = new LChart(dom, (lightOpt as LightOpt), (cameraOpt as CameraOpt));
    // 构造chart所需数据
    const chartData = data.reduce((acc, item, index) => {
        const dataArr = item.data.reduce((t: any[], e: number, i: number) => {
            const singlePoint = {
                perWidth,
                height: getPercent(e, maxPointValue),
                color: item.color,
                title: item.title,
                toolTip: item.toolTip,
            }
            t.push(singlePoint);
            return t;
        }, [])
        acc.push(dataArr)
        return acc;
    }, [])
    // 添加物体
    const chartMesh = new AreaChart(chartData, { smooth })
    chartContext.setChartData(chartMesh.group)
}

/**
 * @description 绘制金字塔
 * @param data
 */
export function drawPyramid(dom: string, data: PieData[], options: ChartOptions = {}) {
    const { lightOpt = {}, cameraOpt = {}, manifest = {} } = options;
    const totalPart = data.reduce((acc, cur) => {
        return acc += cur.value
    }, 0)
    // 获取个模块比例
    const percent = data.reduce((acc: number[], cur) => {
        acc.push(getPercent(cur.value, totalPart));
        return acc;
    }, [])

    // 初始化chart
    const chartContext = new LChart(dom, (lightOpt as LightOpt), (cameraOpt as CameraOpt));
    // 构造chart所需数据
    const chartData = data.map((item, index) => {
        return {
            radius: 1,
            percent: percent[index],
            color: item.color,
            title: item.title,
            toolTip: item.toolTip,
        }
    })
    // 添加物体
    const chartMesh = new PyramidChart(chartData, {})
    chartContext.setChartData(chartMesh.group)
}
